
const React =qguan('react');
const Row=qguan("Row1");
const  File=qguan("File1");
const Block =qguan("Block1");
const mianBody = {
    height: ' 100%',
    margin: ' 0',
    padding: ' 0',
    font:"12px/1.5 tahoma, arial, 'hiragino sans gb', 'microsoft yahei', sans-serif",
    WebkitFontSmoothing:'antialiased',
}
const mian = {width: '49%', height: '100%', float: 'left',}
const leftBox = {background: '#ecf0f5', width: '35px', height: '100%', textAlign:'left', float:' left',}
const test = {
    border: '1px solid #eaeaea',
    outline: 'none',
    width: '600px',
    height: '100%',
    resize: ' none',
    background: ' rgb(250,250,250)',
    lineHeight:'24px',
    fontSize:'14px',
    float:'left',
    padding:'10px 8px',
    color:' black',
    fontFamily:'inherit',
    boxSizing:'border-box'
}
const leftNum = {height: '100%',
    width: ' 100%',
    resize: ' none',
    outline: 'none',
    overflowY:'hidden',
    overflowX:'hidden',
    border:' 0',
    background:'rgb(247,247,247)',
    color:' #999',
    lineHeight:'24px',
    fontSize:'14px',
    padding:'10px 4px',
    textAlign:'right',
    fontWeight:'bold',
    boxSizing:'border-box'
}



export default class CodeEdit extends React.Component {
    constructor(props) {
        super(props)
        //状态值
        this.file=new File();
        this.file.addData(0,null,null,new Block())
        this.file.addData(0,0,null,new Row())
        this.file.addData(0,null,null,new Block())
        this.state = {
            testValue:1,
            rtestValue:1,
            testTxtValue:"",
            rtestTxtValue:"",
            testScrollTop:10,
            rtestScrollTop:10
        }

        //输出  接受
        window.ipcRenderer.on('codeOutMes', (event, arg) => {
            this.outMes(arg)
        });
    }

    //输入 发送
    inMes( ) {
       let data=   this.file.outData();
        window.ipcRenderer.send('codeInMes',{data:data,msg:"代码数据"})
    }
    outMes(arg){
        this.file=new File();
        this.file.loadData(arg.data)
        if(this.file.list.length<=1){
            this.file=new File();
            this.file.addData(0,null,null,new Block())
            this.file.addData(0,0,null,new Row())
            this.file.addData(0,null,null,new Block())
        }
        let codeList= this.findTxt(this.file.list[0])
        let codeListNum=this.keyUp1(codeList);
        let code=this.findTxt(this.file.list[1])
        let codeNum=this.keyUp1(code)
        let res={}

        res["testValue"]=codeListNum
        res["testTxtValue"]=codeList;
        res["rtestValue"]=codeNum
        res["rtestTxtValue"]=code;
        this.lineId=1;
        this.setState(res)
    }


    keyUp1(str){
        /*let id= event.target.id;
        let str =  event.target.value;*/
        str = str.replace(/\r/gi,"");
        str = str.split("\n");
        let    n = str.length;
        n= n==1?n:n++;
       let num = "";
        for(let i = 1;i <= n;i ++){
            if(document.all){
                num += i + "\r\n";//判断浏览器是否是IE
            }else{
                num += i + "\n";
            }
        }
/*        let xx={}
        xx[id+"Value"]=num ;*/
        return num;

    }
    keyUp(event){
        let id= event.target.id;
        let str =  event.target.value;
        str = str.replace(/\r/gi,"");
        str = str.split("\n");
        let    n = str.length;
        n= n==1?n:n++;
        let num = "";
        for(let i = 1;i <= n;i ++){
            if(document.all){
                num += i + "\r\n";//判断浏览器是否是IE
            }else{
                num += i + "\n";
            }
        }
        let xx={}
        xx[id+"Value"]=num
        this.setState(xx);

        if(event.keyCode==13){//回车
            let v=  event.target.value;
            let xx=v.substring(0,event.target.selectionStart)
            let xxx=xx.split(new RegExp(/\n/))
            let xxwww={}
            let lineId=xxx.length
            let strt=this.file.list.slice(0,lineId+1);
            let end=this.file.list.slice(lineId+1,this.file.list.length)
            strt.push(new Block());
            strt.push(...end);
            this.file.list=strt;
            this.lineId=this.lineId+1;
            this.setState({rtestTxtValue:""});
        }
        if(event.keyCode==8){//前删
            let v=  event.target.value;
            let xx=v.substring(0,event.target.selectionStart-1)
            let xxx=xx.split(new RegExp(/\n/))
            let xxwww={}
            let lineId=xxx.length
            if(lineId!=  this.lineId){
                let strt=this.file.list.slice(0,lineId+1);
                let end=this.file.list.slice(lineId+2,this.file.list.length)
                strt.push(...end);
                this.file.list=strt;
                this.lineId=lineId;
                this.setState({rtestTxtValue:this.findTxt(this.file.list[lineId])});
            }

        }
        if(event.keyCode==46){//后删
             event.preventDefault()


        }

    }
    //滚动滑轮 同步 行号
    saveScrollTop   ( event)  {
       let id=  event.target.id ;
        document.getElementById(id+"LeftNum").scrollTop = event.target.scrollTop
        // this.setState(xx);
    }

    //鼠标点击之后
      getOffsetPointer(event) {

            let v=  event.target.value;
            let xx=v.substring(0,event.target.selectionStart)
            let xxx=xx.split(new RegExp(/\n/))
            let xxwww={}
           let lineId=xxx.length
           let block= this.file.findData(lineId,null,null,null);
            let str=this.findTxt(block)
          let num=this.keyUp1(str)


            this.setState({rtestTxtValue:str,"rtestValue":num})

            this.lineId=lineId;
    }
//设置textareaValue
    handleTextareaChange(e){

        let id=e.target.id;
        let val=e.target.value;

        let thatList=val.split("\n");
        let block= new Block()
        for (let i=0;i<thatList.length;i++){
            let wordList=thatList[i].split(',')
            block.addData(0,0,null,new Row(...wordList))
        }
        this.file.saveData(0,null,null,block);
        let num=this.keyUp1(e.target.value)

        let res={}
        res[id+"Value"]=num
        res[id+"TxtValue"]=val;
        this.setState(res)

    }
    //设置textareaValue
    rtestTextareaChange(e){
        let id=e.target.id;
        let val=e.target.value;

        let thatList=val.split("\n");
        let block= new Block()
        for (let i=0;i<thatList.length;i++){
            let wordList=thatList[i].split(',')
            block.addData(0,0,null,new Row(...wordList))
        }
        this.file.saveData(this.lineId,null,null,block);
        let num=this.keyUp1(e.target.value)

        let res={}
        res[id+"Value"]=num
        res[id+"TxtValue"]=val;
        this.setState(res)

    }
    findTxt(block){
        let rtestTxtValue="";
        for(let l=0;l<block.list.length;l++){
            rtestTxtValue+=block.list[l].toString()+"\n";
        }

        let reg2 =new RegExp(/\n+$/);
        rtestTxtValue=rtestTxtValue.replace(reg2,"")
        return rtestTxtValue;
    }


    render() {
        let _this=this;
        return (
            <div id="mian" style={mianBody}>
                <button  onClick={_this.inMes.bind(_this)} > 发送代码到主窗口</button>
                <div  style={mian} >
                    <div id="leftBox"  style={leftBox}>
                        <textarea wrap="off" scrollTop={_this.state.testScrollTop}
                                  cols="2" id="testLeftNum" style={leftNum }  value={_this.state.testValue}
                                  disabled></textarea></div>
                    <textarea id="test"   style={test}  name="content"
                              onMouseUp={_this.getOffsetPointer.bind(_this)}
                              value={ _this.state.testTxtValue }
                              onChange={_this.handleTextareaChange.bind(_this)}
                              onKeyDown={_this.keyUp.bind(_this)}
                              onScroll= {_this.saveScrollTop.bind(_this)}>
    </textarea>
                </div>
                <div  style={mian}>
                    <div id="leftBox1" style={leftBox}>
                        <textarea wrap="off" cols="2" scrollTop={_this.state.rtestScrollTop}
                                  id="rtestLeftNum"style={leftNum }
                                  value={_this.state.rtestValue} disabled></textarea></div>
                    <textarea id="rtest"   style={test} name="content"
                        // onKeyDown ={_this.keyUp1.bind(this)}
                              value={  _this.state.rtestTxtValue }
                            onChange={_this.rtestTextareaChange.bind(this)}
                              onScroll= {_this.saveScrollTop.bind(_this)}
                    >
    </textarea>
                </div>
            </div>
        );
    }
}